import { ref } from 'vue'
import pageBottom from '@/components/multiplex/pageBottom.vue'

const usePageSame = () => {
  const pageBottomIns = ref<InstanceType<typeof pageBottom>>()
  const searchData = ref(null)
  const DialogDOM = ref()
  const handleSearchQuery = (data: any) => {
    pageBottomIns.value?.fetchList(data)
    searchData.value = data
  }

  // 子组件清除表单内容，父组件触发事件同时获取最新列表数据
  const resetAndQueryList = () => {
    // 将页码归一,每次重置的时候都从第一页展示数据，并且分页器也是第一页
    pageBottomIns.value?.resetPage()
    pageBottomIns.value?.fetchList()
  }

  const handleAddUser = () => {
    // 添加用户不需要预览数据，因此只需要传递一个显示弹窗即可
    DialogDOM.value?.changeDialogVisible(true)
  }
  const handleUpdate = (val: any) => {
    // 编辑按钮复用添加用户的弹窗组件使用，需要将数据传递过去显示预览
    // 触发时机就是点击显示弹窗的时候需要将数据传递过去
    const isEdit = true
    DialogDOM.value?.changeDialogVisible(true, isEdit, val)
  }
  return {
    pageBottomIns,
    searchData,
    DialogDOM,
    handleSearchQuery,
    resetAndQueryList,
    handleAddUser,
    handleUpdate
  }
}

export default usePageSame
